<!-- 阅读明细 -->
<template>
  <div class='read_detail'>
    <Row class="export_table">
      <Col offset='1'><Button type="primary" @click="exportTable()" :disabled="pageData.total==0">导出Excel</Button></Col>
    </Row>
    <Table ref="TableHeight" border :max-height="onresizeHeight" :columns="columns" :data="list"></Table>
    <!-- 分页 -->
    <!-- <page :pageData='pageData' @pageOnChangeFun='pageOnChangeFun' @pageOnPageSizeChangeFun='pageOnPageSizeChangeFun' /> -->
    <!-- 特殊分页 勿改 -->
    <div class="pagePublicStyle" v-show="pageData.total > 0">
      <div class="totalCount"> 当前第 {{ pageData.current }} 页， 当前第 {{ (pageData.current - 1) * pageData.rows + 1 }} 条到第
        {{ pageData.current * pageData.rows > pageData.total ? pageData.total : pageData.current * pageData.rows}}
        条， 共 {{ pageData.total }} 条
      </div>
      <Page :total="pageData.total" :current="pageData.current" :page-size-opts="pageData.pageSizeOpts" @on-change="pageOnChangeFun" placement="top" />
    </div>
  </div>
</template>

<script>
import columnsAll from '../columns'
import msgApi from '@/biz/message'
export default {
  components: {},
  props: {
    rowData: {
      type: Object,
      defult: null,
    },
  },
  data() {
    return {
      list: [],
      columns: columnsAll.readDetailColumns(this),
      onresizeHeight: 500,
      pageData: {
        total: 0,
        current: 1,
        rows: 10,
        pageSizeOpts: [10, 20, 30, 40, 50],
      },
    }
  },
  methods: {
    init() {
      let params = {
        msgId: this.rowData.msgId,
        createId: this.rowData.createId,
        page: this.pageData.current * this.pageData.rows - 10,
        rows: this.pageData.current * this.pageData.rows,
      }
      console.log(params)
      msgApi.getMessageReadingDetails(params).then((res) => {
        this.list = res.list
        this.pageData.total = Number(res.pages)
      })
    },
    //分页触发
    pageOnChangeFun(pages) {
      console.log(pages, 'pages')
      this.pageData.current = pages
      this.init()
    },
    //改变每页条数触发
    pageOnPageSizeChangeFun(rows) {
      this.init()
    },
    //导出阅读明细
    exportTable() {
      let params = {
        msgId: this.rowData.msgId,
        createId: this.$dt.userInfo().userId,
      }
      msgApi.exportMessage(params)
    },
  },
  created() {},
  mounted() {
    this.init()
  },
}
</script>
<style lang='scss' scoped>
.read_detail {
  .export_table {
    margin-bottom: 20px;
  }
}
</style>